.icon-button {
  margin-top: 5px;
  margin-left: 2.5px;
  margin-right: 2.5px;
  width: 12px;
  height: 12px;
  background-color: #37c411;
  border-radius: 100%;

  display: flex;
  align-items: center;
  justify-content: center;

  cursor: pointer;
  // 是 CSS3 中的一个过渡属性，用于设置元素在属性变化时的过渡效果。
  // 具体来说，transition 属性可以用于设置元素在属性变化时的过渡时间、过渡方式和过渡延迟等。
  // 其中，all 表示对元素所有属性进行过渡效果，0.3s 表示过渡时间为 0.3 秒，ease 表示过渡方式为缓动函数，即变化速度先慢后快再慢。
  // 因此，当元素的某个属性发生变化时，例如颜色、大小、位置等，就会在 0.3 秒内以缓动方式过渡到新的属性值，从而实现平滑的过渡效果。
  // transition 属性的其他取值还包括 property、duration、timing-function 和 delay 等，分别表示过渡属性、过渡时间、过渡方式和过渡延迟。
  transition: all 0.3s ease;
  overflow: hidden;
  outline: none;
  border: none;
  user-select: none;
}

.icon-button-icon {
  width: 12px;
  height: 12px;
  display: flex;
  justify-content: center;
  align-items: center;
}
